<template>
<div>
    <header1></header1>
<div class="navbar-banner layout-no-margin-top">
    <div class="banner-container">
        <div class="container">
            <div class="row">
                <div class="col-md-7">
                    <a class="container-title">
                        <img src="/static/img/container-title-2.png" />
                    </a>
                    <div style="margin-top:24px;">
                        <a id="course-btn" class="course-btn btn btn-lg" href="courses/index.html">进入课程</a>
                    </div>
                </div>

                <div class="col-md-5">

                    <form action="/quickregister" method="post">
                        <div class="form-group">
                            <input class="form-control" name="name" id="name" type="text" placeholder="昵称">
                            <div class="help-block text-left"></div>
                        </div>
                        <div class="form-group">
                            <input class="form-control" name="email" id="email" type="email" placeholder="邮箱">
                            <div class="help-block text-left"></div>
                        </div>
                        <div class="form-group">
                            <input class="form-control" name="password" id="password" type="password" placeholder="密码">
                            <div class="help-block text-left"></div>
                        </div>
                        <button class="btn register" type="submit">加入实验楼</button>
                        <p class="tip">点击"加入实验楼"，表示您已经同意我们的<a href="privacy/index.html" target="_blank"> 隐私条款</a></P>
                    </form>

                </div>

            </div>
        </div>
    </div>
</div>

<div class="introduce-container" id="fourFeatures">
    <div class="container">
        <div class="row">
            <div class="introduce-unit col-sm-6 col-md-3">
                <div><a class="introduce-img"><img src="/static/img/introduceContainer1.gif" /></a></div>
                <div><span class="introduce-span">丰富全面的计算机实验课程</span></div>
            </div>
            <div class="introduce-unit col-sm-6 col-md-3">
                <div><a class="introduce-img"><img src="/static/img/introduceContainer2.gif" /></a></div>
                <div><span class="introduce-span">在线编程环境，1秒启动</span></div>
            </div>
            <div class="introduce-unit col-sm-6 col-md-3">
                <div><a class="introduce-img"><img src="/static/img/introduceContainer3.gif" /></a></div>
                <div><span class="introduce-span">每天一个项目课，丰富你的项目经验</span></div>
            </div>
            <div class="introduce-unit col-sm-6 col-md-3">
                <div><a class="introduce-img"><img src="/static/img/introduceContainer4.gif" /></a></div>
                <div><span class="introduce-span">有效学习时间，真实记录你的代码生涯</span></div>
            </div>
        </div>
    </div>
</div>

<div class="line-and-laboratory">
	<div class="container">
        <div class="clearfix text-center item-header">
            <span class="line"></span>
            <span class="text-center item-title">学习路径</span>
            <span class="line"></span>
        </div>
		<div class="tab-content">
			<div class="tab-pane clearfix active" id="study-line">
                <div class="col-xs-12 col-sm-6 col-md-4">
					<a href="paths/show.html">
                        <div class="path-item">
                            <div class="col-xs-5 col-sm-4 path-img">
                                <img src="/static/img/1471513730333.png">
                            </div>
                            <div class="col-xs-7 col-sm-8">
                                <div class="path-name">新手入门</div>
                                <div class="path-course-num">
                                    <span>6</span>
                                    门课程
                                </div>
                            </div>
                            <div class="desc-layer">
                                <div class="center">新手入门路径帮助对 IT 技术感兴趣的新手0基础入门计算机编程。本路径通过新手入门、Linux 及 Vim课程熟悉实验楼的实践学习环境，再以 C 语言和一个简单的项目引导你一步步进入计算机技术的殿堂。</div>
                            </div>
                        </div>
					</a>
                </div>
			</div>
		</div>
	</div>
</div>

<div class="line-and-laboratory">
	<div class="container">
        <div class="clearfix text-center item-header">
            <span class="line"></span>
            <div class="text-center item-title">实验课程</div>
            <span class="line"></span>
        </div>
		<div class="clearfix courses">

<div class="col-md-3 col-sm-6  course">
    <a class="course-box" href="courses/show.html">
        <div class="sign-box">



            <i class="fa fa-star-o course-follow pull-right"
                data-follow-url="/courses/1/follow"
                data-unfollow-url="/courses/1/unfollow"  style="display:none"  ></i>

        </div>
        <div class="course-img">

            <img alt="Linux 基础入门（新版）" src="/static/img/ncn1.jpg">

        </div>

        <div class="course-body">
            <span class="course-title" data-toggle="tooltip" data-placement="bottom" title="Linux 基础入门（新版）">Linux 基础入门（新版）</span>
        </div>
        <div class="course-footer">
			<span class="course-per-num pull-left">
                <i class="fa fa-users"></i>

                85157

			</span>



        </div>
    </a>
</div>


    <div class="col-md-3 col-sm-6  course">
        <a class="course-box" href="courses/show.html">
            <div class="sign-box">



                <i class="fa fa-star-o course-follow pull-right"
                    data-follow-url="/courses/11/follow"
                    data-unfollow-url="/courses/11/unfollow"  style="display:none"  ></i>

            </div>
            <div class="course-img">

                <img alt="Go语言编程" src="/static/img/ncn11.jpg">

            </div>

            <div class="course-body">
                <span class="course-title" data-toggle="tooltip" data-placement="bottom" title="Go语言编程">Go语言编程</span>
            </div>
            <div class="course-footer">
                <span class="course-per-num pull-left">
                    <i class="fa fa-users"></i>

                    5741

                </span>



            </div>
        </a>
    </div>


<div class="col-md-3 col-sm-6  course">
    <a class="course-box" href="courses/show.html">
        <div class="sign-box">



            <i class="fa fa-star-o course-follow pull-right"
                data-follow-url="/courses/23/follow"
                data-unfollow-url="/courses/23/unfollow"  style="display:none"  ></i>

        </div>
        <div class="course-img">

            <img alt="PHP编程语言" src="/static/img/ncn23.jpg">

        </div>

        <div class="course-body">
            <span class="course-title" data-toggle="tooltip" data-placement="bottom" title="PHP编程语言">PHP编程语言</span>
        </div>
        <div class="course-footer">
			<span class="course-per-num pull-left">
                <i class="fa fa-users"></i>

                8093

			</span>



        </div>
    </a>
</div>


    <div class="col-md-3 col-sm-6  course">
        <a class="course-box" href="courses/show.html">
            <div class="sign-box">
                <i class="fa fa-star-o course-follow pull-right"
                    data-follow-url="/courses/30/follow"
                    data-unfollow-url="/courses/30/unfollow"  style="display:none"  ></i>

            </div>
            <div class="course-img">

                <img alt="Python Django Web框架" src="/static/img/ncn30.jpg">

            </div>

            <div class="course-body">
                <span class="course-title" data-toggle="tooltip" data-placement="bottom" title="Python Django Web框架">Python Django Web框架</span>
            </div>
            <div class="course-footer">
                <span class="course-per-num pull-left">
                    <i class="fa fa-users"></i>

                    5691

                </span>



            </div>
        </a>
    </div>


		</div>
        <div class="clearfix item-footer">
            <div class="pull-right watch-all">
                <a @click='gitbook'>查看更多 ></a>
            </div>
        </div>
	</div>
</div>
    <footer1></footer1>
</div>
</template>
<script>
    import header1 from "./header";
    import footer1 from "./footer";
    import {Gitbook} from '../api/api.js'
    export default {
        name: "aa",
        components:{
            'header1':header1,
            'footer1':footer1
        },
        data() {
            return {
            }
        },
        methods:{
            gitbook:function (param) { 
                Gitbook(param).then(res=>{
                    alert('完成')
                })
             }
        },

    }

</script>

<style scoped>

</style>
